<template>
	<view class="wallet_box">
		<view class="bg"></view>
		<view class="wdzj_box">
			<div class="wdzj">
				<view class="tit">我的资金</view>
				<view class="price_box">
					<view class="price">{{data.userblacne.available}}<text>可提现金额</text></view>
					<view class="total_price fx_column dis_fx">{{data.userblacne.totalBlance}}<text>总金额</text></view>
				</view>
				<view class="btn" @click="withDraw" v-if="data.withdrawalRuleService.status==1">提现</view>
			</div>
		</view>
		<view class="wdjf_box hide"><view class="wdjf dis_fx fx_center"><text>我的积分：</text><view class="num"> 454</view></view></view>
		<!-- 提现确定弹框 -->
		<view class="dialog_box sure_dialog" :class="clsCirBtn">
			<view class="dialog_con">
				<view class="dialog">
					<view class="dis_fx fx_column fx_center_column prompt">
						<text>是否提现到微信零钱？</text>
						<view class="price dis_fx fx_column"><view class="unit">￥</view><text>{{data.userblacne.available}}</text></view>
					</view>
					<view class="btns dis_fx fx_center"><view class="btn" @click="closeCirBtn">取消</view><view class="btn sub" @click="cirWithDraw">确认</view></view>
				</view>
				<view class="close_btn" @click="closeCirBtn"></view>
			</view>
		</view>
		<!-- 提现提示弹框 -->
		<view class="dialog_box prompt_dialog" :class="clsBtn">
			<view class="dialog_con">
				<view class="dialog dis_fx fx_center_column fx_column">
					<view class="dis_fx fx_column prompt">提现金额必须大于<view class="cur_text">{{data.withdrawalRuleService.limitMinAmount}}</view>元</view>
					<view class="btn" @click="closeBtn">知道了</view>
				</view>
				<view class="close_btn" @click="closeBtn"></view>
			</view>
		</view>
	</view>
</template>

<script>
	import util from '../../common/util.js'
	export default {
		data() {
			return {
				clsBtn:'hide',
				clsCirBtn:'hide',
				data:{}
			}
		},
		onLoad(){
			
		},
		onShow(){
			this.getData()
		},
		methods: {
			closeBtn(){
				var that=this;
				that.clsBtn="hide"
			},
			closeCirBtn(){
				var that=this;
				that.clsCirBtn="hide"
			},
			//提现
			withDraw(){
				let that=this;
				let available=that.data.userblacne.available;
				let limitMinAmount= that.data.withdrawalRuleService.limitMinAmount;
				if(available>=limitMinAmount){
					that.clsCirBtn=""
				}else{
					that.clsBtn=""
				}
			},
			//确认提现
			cirWithDraw(){
				uni.showLoading({
					mask:true,
					title: '加载中'
				});
				var that=this
				var params={
					amount:that.data.userblacne.available
				}
				util.fetchPost('/funds/applyWithdraw',params,function(res){
					console.log(res)
					uni.hideLoading();
					that.clsCirBtn="hide"
					that.getData()
				},function(){},true)
			},
			//加载数据
			getData(){
				uni.showLoading({
					mask:true,
					title: '加载中'
				});
				var that=this
				var params={}
				util.fetchPost('/funds/myWallet',params,function(res){
					that.data=res.data
					uni.hideLoading();
				},function(){},true)
			}
		}
	}
</script>

<style>
	.wallet_box .bg{
		height: 200upx;
		width: 100%;
		background-color: rgb(255, 200, 0);
	}
	.wallet_box .wdzj_box{
		padding: 0 24upx;
	}
	.wallet_box .wdzj{
		background: #fff;
		box-shadow: 0 0 18upx 0 rgba(106, 79, 13, 0.12);
		border-radius: 10upx;
		margin-top: -150upx;
		padding: 25upx 25upx 45upx;
	}
	.wallet_box .wdzj .tit{
		font-size: 32upx;
		color: #333333;
		font-weight: 600;
		margin-bottom: 65upx;
	}
	.wallet_box .wdzj .price_box{
		width: 280upx;
		position: relative;
		left: 50%;
		margin-left: -140upx;
	}
	.wallet_box .wdzj .price{
		font-size: 72upx;
		color: #FC5C1D;
		position: relative;
	}
	.wallet_box .wdzj .price text{
		position: absolute;
		font-size: 22upx;
		right: -130upx;
		top: 20upx;
	}
	.wallet_box .wdzj .total_price{
		font-size: 32upx;
		color: #999999;
	}
	.wallet_box .wdzj .total_price text{
		font-size: 22upx;
		color: #C1C1C1;
		margin-left: 10upx;
	}
	.wallet_box .wdzj .btn{
		width: 600upx;
		height: 90upx;
		background: #FFC800;
		color: #333333;
		font-size: 36upx;
		text-align: center;
		line-height: 90upx;
		border-radius: 45upx;
		margin: 80upx auto 0;
	}
	.wallet_box .wdjf_box{
		padding: 0 24upx;
	}
	.wallet_box .wdjf{
		width: 100%;
		height: 150upx;
		line-height: 150upx;
		background: #FFF5C5;
		border-radius: 150upx;
		margin-top: 80upx;
	}
	.wallet_box .wdjf text{
		color: #757575;
		font-size: 32upx;
	}
	.wallet_box .wdjf .num{
		color: #FFC800;
		font-size: 48upx;
	}
	.wallet_box .sure_dialog .prompt text{
		font-size: 32upx;
		color: #333333;
		margin-bottom: 10upx;
	}
	.wallet_box .sure_dialog .prompt .price .unit{
		font-size: 32upx;
		color: #FC5C1D;
	}
	.wallet_box .sure_dialog .prompt .price text{
		font-size: 48upx;
		color: #FC5C1D;
	}
	.wallet_box .sure_dialog .btns .btn{
		width: 240upx;
		height: 80upx;
		line-height: 80upx;
		border-radius: 40upx;
		border: 1px solid #FFC800;
		text-align: center;
		color: #FFC800;
		font-size: 32upx;
		margin-top: 60upx;
	}
	.wallet_box .sure_dialog .btns .btn.sub{
		background: #FFC800;
		color: #fff;
		margin-left: 80upx;
	}
	.wallet_box .prompt_dialog .prompt{
		font-size: 32upx;
		color: #333;
	}
	.wallet_box .prompt_dialog .btn{
		width: 560upx;
		height: 80upx;
		line-height: 80upx;
		background: #FFC800;
		color: #fff;
		border-radius: 40upx;
		text-align: center;
		font-size: 32upx;
		margin-top: 80upx;
	}
</style>
